import 'package:flutter/material.dart';
import '../../helper/utils/util.dart';
import '../me/view.dart';
import 'controller.dart';
import 'package:whale/pages/means/main/index.dart';
import 'package:whale/pages/report/main/index.dart';
import 'package:whale/pages/watch/main/index.dart';

import '../home/main/view.dart';

class AppTabPage extends GetView<AppTabController> {
  const AppTabPage({Key? key}) : super(key: key);

  Widget getIcon(String url) {
    return Image.asset(
      url.imgPathAppTab,
      // width: 18.r,
      height: 22.r,
      fit: BoxFit.contain,
    );
  }

  // Widget getIcon(IconData icon, {bool isActive = false}) {
  //   return Icon(
  //     icon,
  //     color: isActive ? ColorsUtil.theme : Color(0xffbcbcbc),
  //     size: 22.r,
  //   );
  // }

  Widget _getPage(int idx) {
    switch (idx) {
      case 0:
        return HomePage();
      case 1:
        return MeansPage();
      case 2:
        return WatchPage();
      case 3:
        return ReportPage();
      case 4:
        return MePage();
      default:
        return Container();
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PageView.builder(
        itemBuilder: (ctx, idx) {
          return AutoAlivePage(child: _getPage(idx));
        },
        onPageChanged: (value) {
          controller.state.currentIndex.value = value;
        },
        physics: const NeverScrollableScrollPhysics(),
        controller: controller.state.pageController,
      ),
      bottomNavigationBar: Obx(() => BottomNavigationBar(
            type: BottomNavigationBarType.fixed,
            selectedItemColor: ColorsUtil.theme,
            unselectedItemColor: const Color(0xffbcbcbc),
            items: controller.state.items
                .map((e) => BottomNavigationBarItem(
                    label: e.title,
                    icon: getIcon(e.icon),
                    activeIcon: getIcon(e.activeIcon)))
                .toList(),
            currentIndex: controller.state.currentIndex.value,
            selectedFontSize: 12,
            unselectedFontSize: 12,
            onTap: (index) => controller.clickTab(index),
            backgroundColor: Colors.white,
          )),
    );
  }
}

class AutoAlivePage extends StatefulWidget {
  const AutoAlivePage({
    Key? key,
    required this.child,
  }) : super(key: key);
  final Widget child;
  @override
  State<AutoAlivePage> createState() => _AutoAlivePageState();
}

class _AutoAlivePageState extends State<AutoAlivePage>
    with AutomaticKeepAliveClientMixin {
  @override
  Widget build(BuildContext context) {
    super.build(context);
    return widget.child;
  }

  @override
  bool get wantKeepAlive => true;
}
